<template>
	<view class="container">
		<view class="panel-header padding-top solid-bottom">
			<view class="g-goBack" @click="$utils.toBack()">
				<view class="cuIcon-back"></view>
			</view>
			<view class="text-cut">{{placeName}}</view>
		</view>
		<view class="cu-card no-card">
			<view class="cu-item padding">
				<view class="flex justify-between padding-bottom-sm solid-bottom margin-top">
					<view class="title">业务类型</view>
					<picker mode="selector" :value="businessType" :range="busiTypeList" range-key="businessTypeName" @change="onChangeBusinessType">
						<text>{{businessTypeName}}</text>
					</picker>
				</view>
			</view>
		</view>
		<view class="cu-bar btn-group margin-top">
		    <button class="cu-btn bg-grey shadow-blur round" @click="btnCancel()">取消</button>
			<button class="cu-btn bg-orange shadow-blur round" @click="btnSaveSubmit()">确定</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				placeId:null,
				placeName:'网点名称',
				businessType:null,
				businessTypeName:null,
				busiTypeIndex:0,
				busiTypeList:[]
			};
		},
		onLoad(option) {
			const _self = this;
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.on('fromData', function(data) {
			    console.log(data)
				_self.placeId = data.placeId;
				_self.placeName = data.placeName;
				_self.businessType = data.businessType;
				_self.businessTypeName = data.businessTypeName;
				_self.feeTemplateId = data.feeTemplateId;
				_self._loadBusinessType();
			})
		},
		methods: {
			_loadBusinessType:function(){
				const api = this.$request;
				const _self = this;
				api.post(api.url.commBusinessTypeList,{},res=>{
					console.log(res)
					if(res.code==200){
						_self.busiTypeList = res.body.items;
						_self.businessType = _self.busiTypeList[_self.busiTypeIndex].businessType;
						_self.businessTypeName = _self.busiTypeList[_self.busiTypeIndex].businessTypeName;
					}else if(res.msg){
						uni.showModal({
							content:res.msg,
							showCancel:false
						});
					}else {
						uni.showToast({
							title:'获取数据失败',
							icon:'error'
						});
					}
				})
			},
			onChangeBusinessType:function(e){
				console.log(e);
				this.busiTypeIndex = e.detail.value;
				this.businessType = this.busiTypeList[this.busiTypeIndex].businessType;
				this.businessTypeName = this.busiTypeList[this.busiTypeIndex].businessTypeName;
			},
			btnCancel:function(){
				uni.navigateBack();
			},
			btnSaveSubmit:function(item){
				const _self = this;
				const api = this.$request;
				uni.showModal({
					title:'温馨提示',
					content:'确定要添加新业务类型吗？',
					complete:function(res){
						if(res.confirm){
							api.post(api.url.placeBusiTypeSave,{
								placeId:_self.placeId,
								businessType:_self.businessType
							},res=>{
								console.log(res)
								if(res.code==200){
									uni.showToast({
										title:'操作成功',
										icon:'success'
									});
									setTimeout(function(){
										uni.navigateBack();
									},1500)
								}else if(res.msg){
									uni.showModal({
										content:res.msg,
										showCancel:false
									});
								}else {
									uni.showToast({
										title:'操作失败',
										icon:'error'
									});
								}
							})
						}
					}
				})
			}
		}
	}
</script>

<style lang="less">
.container .panel-header{height:90rpx;width:100vw;font-size:28rpx;background-color:#fff;}
.container .panel-header .text-cut{width:75%;margin:auto;text-align:center;}
.container .list-body scroll-view{height:85vh;}
.container .list-body .cu-card .title {min-width:calc(4em + 30rpx);display:inline-block;margin-bottom:5rpx;}
.container .list-body .cu-card .cu-item {position: relative;}
.container .list-body .cu-card .cu-item .btn-info{position: absolute;bottom:30rpx;right:15rpx;}
</style>
